import { buildProps } from '@v-model/shared--utils'
import { type ExtractPropTypes } from 'vue'

export const vtableProps = buildProps({
  /**
   * 表格数据源 table  、  当 在 vtable 已组件形式使用时， 直接使用  modelvalue 形式
   */
  modelValue: {
    type: Array,
    default: [],
  },

  /**
   * 表格数据源 table
   */
  data: {
    type: Array,
    default: '',
  },

  /**
   * @description 表格动态列的数据源
   */
  columns: {
    type: Array,
    default: () => [],
  },
  /**
   * 斑马样式, 与 element-plus 同步
   */
  stripe: {
    type: Boolean,
    default: true,
  },

  /**
   * 表格边线
   */
  border: {
    type: Boolean,
    default: true,
  },

  /**
   * 操作列显的数据   编辑 E、删除 D、 保存 S
   */
  operate: {
    type: Array,
    default: [],
  },

  /**
   * 右边操作列表的宽度
   */
  rwidth: {
    type: [String, Number],
    default: '',
  },
  /**
   *  'text' | 'line' // 合并单元格 text 合并文本，  line 显示合并连线，需单独一行作为参数
   */
  mspan: {
    type: String,
    default: '',
  },
  /**
   *  当有编辑行时，是否开启键盘 enter 操作
   */
  iskeyboard: {
    type: Boolean,
    default: false,
  },

  /**
   *  行数据的key值字段
   */
  rowkey: {
    type: String,
    default: '',
  },

  /**
   *  行数据判断为同组的勾选
   */
  sameTick: {
    type: Boolean,
    default: false,
  },

  /**
   *  unitTick 启用，只能勾选一组
   */
  unitTick: {
    type: Boolean,
    default: false,
  },

  /**
   * 验证没通过自动调整并提示信息
   */
  unvalidjump: {
    type: Boolean,
    default: true,
  },

  /**
   * @description 查询数据key  value 选中值绑定的字段
   */
  fields: {
    type: Array,
    default: () => [],
  },

  /**
   * 点击行是否触发勾选状态
   */
  clickToggleSelected: {
    type: Boolean,
    default: false,
  },

  /**
   *  是否显示分组线
   */
  isGroup: {
    type: Boolean,
    default: false,
  },

  /**
   * //判断同组标识  、 判断同组的字段值
   */
  groupMark: {
    type: String,
    default: 'ordGroupNo',
  },

  /**
   * 需要显示分组线的列、  列的字段
   */
  groupProp: {
    type: String,
    default: 'ordOrderItemName',
  },

  /**
   * @description 分组时分页参数
   */
  pageNum: {
    type: Number,
    default: 1,
  },

  /**
   * @description 分组分页默认查询两百
   */
  pageSize: {
    type: Number,
    default: 200,
  },
  /**
   * @description element-plus 表格选中返回的数据是根据选中时先后顺序返回的，默认返回数据顺序不变，
   * selectSort  为 true 时，返回数据跟表格顺序相同的
   */
  selectSort: {
    type: Boolean,
  },
  /**
   * @description table行的 className 的回调方法，也可以使用字符串为所有行设置一个固定的 className。
   */
  rowClassName: {
    type: Function,
  },
  /**
   * @description table 开启虚拟列表优化, 只展示可视区域列表视图
   */
  virtualize: {
    type: Boolean,
  },
} as const)

export type VTableProps = ExtractPropTypes<typeof vtableProps>

// const emits = defineEmits(['modify', 'save', 'remove', 'select', 'selection-change', 'row-click'])
export const vtableEmits = {
  modify: (scope: any) => scope,
  save: (scope: any) => scope,
  remove: (scope: any) => scope,
  selectionChange: (scope: any) => scope,
  rowClick: (scope: any) => scope,
  select: (data: any[], row: Object) => data,
  'selection-change': (data: any) => data,
  'select-all': (data: any) => data,
}

export type VtableEmits = typeof vtableEmits
